<template>
  <div>
    <el-button class="mb20" @click="handleBack">返回</el-button>
    <el-card shadow="never" class="mb20">
      <div slot="header">基本信息</div>
      <el-form :model="form" ref="form" label-suffix="：" label-width="100px">
        <el-row :gutter="16">
          <el-col>
            <el-form-item class="mb10" label="处方号">{{ form.prescript_no }}</el-form-item>
          </el-col>
          <el-col>
            <el-form-item class="mb10" label="处方日期">{{ form.prescript_time }}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item class="mb10" label="医生名称">{{ form.his_doctor_name }}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item class="mb10" label="科室名称">{{ form.his_dept_name }}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item class="mb10" label="药品总数">{{ form.drug_dis_num }}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item class="mb10" label="处方金额">{{ form.prescript_cost }}</el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-card shadow="never" class="mb20">
      <div slot="header">患者信息</div>
      <el-form :model="form" ref="form" label-suffix="：" label-width="100px">
        <el-row :gutter="16">
          <el-col :span="12">
            <el-form-item class="mb10" label="患者姓名">{{ form.patient_name }}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item class="mb10" label="病历号">{{ form.med_record_no }}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item class="mb10" label="诊断名称">{{ form.diag_name }}</el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-card shadow="never">
      <div slot="header">药品信息</div>
      <template v-if="list.length > 0">
        <ul>
          <li v-for="(item,index) in list" :key="index">
            <h3>{{ index + 1 }}</h3>
          </li>
        </ul>
      </template>
      <template v-else>
        <empty-comp />
      </template>
    </el-card>
  </div>
</template>

<script>
import { getSession, setSession } from '@/utils/util'
import { getOverPrescriptionDetail } from '@/api/reports'
import EmptyComp from '@/components/EmptyComp'
export default {
  data() {
    return {
      form: this.$route.params.handleRow,
      list: []
    }
  },
  async created() {
    if (JSON.stringify(this.form) !== '{}') {
      setSession('handleRow', this.form)
      const res = await getOverPrescriptionDetail({ prescriptNoColl: this.form.prescript_no })
      console.log('res', res)
      // TODO: 列表
      if (res.data) {
        this.list = res.data
      } else {
        this.list = []
      }
    } else {
      this.form = getSession('handleRow')
    }
  },
  methods: {
    handleBack() {
      this.$router.go(-1)
    }
  }
}
</script>
